<template>
    <div class="h-full flex flex-col">
      <a-card class="min-h-[68px] rounded my-[10px]" :body-style="{ padding: '0px 10px', minHeight: '700px' }"
        :bordered="false">
        <template #extra>
          <a-button class="border-none" icon="rollback" @click="rollback">{{ $t("app.setting.themecolor.rr99") }}
          </a-button>
        </template>
        <iframe id="preview-iframe" src="" width="100%" height="100%"></iframe>
      </a-card>
    </div>
  </template>
    
  <script>
  import axios from 'axios'
  import jwt from 'jwt-simple'
  import storage from "store";
  import { ACCESS_TOKEN } from "@/store/mutation-types";
  export default {
    data() {
      return {
      }
    },
    mounted() {
      const reportName = sessionStorage.getItem('report');
      // console.log('reportName',reportName);
      axios.get(process.env.VUE_APP_BASE_API + '/' + reportName, {
        responseType: 'arraybuffer',
        headers: {
          token: storage.get(ACCESS_TOKEN),
          tokens: storage.get("bmwToken") || "",
          YtAuth: jwt.encode({ bmw: 1 }, 'jwt'),
        },
      })
        .then((response) => {
          const iframe = document.getElementById('preview-iframe');
          const blob = new Blob([response.data], { type: 'application/pdf' });
          iframe.src = URL.createObjectURL(blob);
        })
        .catch((error) => {
          console.error('Error fetching file:', error);
        });
    },
  }
  
  </script>
    
  <style lang="less" scoped></style>